import React, { memo, useRef, FC } from 'react';
import { FormInstance } from 'antd/lib/form';
// import styles from './index.less';
import CommonModal from '@/components/CommonModal';
import EditForm from './EditForm';
import AddForm from './AddForm';
import { modelName } from '../../../../index';
import useHoxModel from '../../../../useHoxModel';
import { ActionType } from '@/components/ProTable';
import { AddDoorType, AddDoorToDoorGroupType } from '../../../../API';
import OpenDoorRecord from '@/pages/Door/components/DoorTable/components/Modal/OpenDoorRecord';
import { SetTimeParmasType } from '@/pages/Door/API';
import TimeForm from '@/pages/Door/components/DoorTable/components/Modal/TimeForm';
import moment from 'moment';
import useDoorHoxModel from '@/pages/Door/useHoxModel';
import { PermissionsConfig } from '@/pages/Authority/components/DoorTable/components/Modal';
import PermissionsDetail from '@/pages/Authority/components/DoorTable/components/Modal/PermissionsDetail';
import AlarmForm from '@/pages/Door/components/DoorTable/components/Modal/AlarmTable';

interface Props {
  actionRef: React.MutableRefObject<ActionType | undefined>;
}

const ModalContent: FC<Props> = (props) => {
  const { actionRef } = props;
  const {
    addDoorToDoorGroup,
    info,
    selectedDoorGroup,
    editDoor,
    doorInfo,
  } = useHoxModel((model) => [model.selectedDoorGroup, model.doorInfo, model.info]);
  const { setTime } = useDoorHoxModel(() => []);
  const formRef = useRef<FormInstance>();

  const confim = async <T extends {}>(
    cancel: () => void,
    request: (params: T) => Promise<any>,
    filterData?: (props: any) => Promise<any>,
  ) => {
    try {
      const fields: any = await formRef.current?.validateFields();
      const params = await (filterData ? filterData(fields) : fields);

      let res = await request(params);
      if (!(res.result < 0)) {
        actionRef.current?.reloadAndRest();
        cancel();
      }
    } catch (errorInfo) {
      console.log('Failed:', errorInfo);
    }
  };
  return (
    <>
      <CommonModal
        title="编辑"
        width={600}
        type={modelName + 'edit'}
        onOk={async (cancelModal: (type?: string, clear?: boolean) => void) => {
          const filterData = (fields: any) => {
            return {
              ...fields,
              id: doorInfo.id,
              regionId: fields.regionId[fields.regionId.length - 1],
            };
          };
          await confim<AddDoorType>(cancelModal, editDoor, filterData);
        }}
      >
        <EditForm formRef={formRef} />
      </CommonModal>
      <CommonModal
        title="配置门组"
        width={820}
        type={modelName + 'add'}
        onOk={async (cancelModal: (type?: string, clear?: boolean) => void) => {
          const filterData = async (fields: any) => {
            return {
              id: selectedDoorGroup,
              doorIds: fields?.selectedDoor?.list.map((item: { id: number }) => item.id),
            };
          };
          await confim<AddDoorToDoorGroupType>(cancelModal, addDoorToDoorGroup, filterData);
        }}
      >
        <AddForm formRef={formRef} />
      </CommonModal>
      <CommonModal title="告警信息" width={'80%'} footer={false} type={modelName + 'alarmInfo'}>
        <AlarmForm id={info.id} />
      </CommonModal>
      <PermissionsConfig
        currentPageType={'door'}
        info={info}
        modelName={modelName}
        actionRef={actionRef}
      />
      <CommonModal footer={false} title="权限详情" width={800} type={modelName + 'detail'}>
        <PermissionsDetail currentPageType={'door'} info={info} />
      </CommonModal>
      <CommonModal title="开门记录" width={800} footer={false} type={modelName + 'openDoorRecord'}>
        <OpenDoorRecord id={info.id} />
      </CommonModal>
      <CommonModal
        title="校准门设备的本地时间"
        width={400}
        type={modelName + 'timeCalibration'}
        onOk={async (cancelModal: (type?: string, clear?: boolean) => void) => {
          const filterData = async (fields: any) => {
            return { time: moment(fields.time).valueOf(), id: info.id };
          };
          await confim<SetTimeParmasType>(cancelModal, setTime, filterData);
        }}
      >
        <TimeForm formRef={formRef} />
      </CommonModal>
    </>
  );
};

export default memo(ModalContent);
